{% extends 'base.html' %}

{% block content %}
{% csrf_token %}

<div>
  <h2 class="text-3xl font-semibold text-center text-gray-800 my-6">Importation de Prévisions des ventes</h2>

  <label for="mois_annee">Mois et année :</label>
  <input type="month" id="mois_annee" name="mois_annee">

  <input id="fileInput" type="file" accept=".xls,.xlsx,application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" />
  <button id="btnImporter">Importer</button>

  <div id="info" style="margin-top:10px;"></div>
  <div id="preview"></div>
</div>

<script src="https://cdn.sheetjs.com/xlsx-latest/package/dist/xlsx.full.min.js"></script>

<script>
  const input = document.getElementById('fileInput');
  const btn = document.getElementById('btnImporter');
  const info = document.getElementById('info');
  const preview = document.getElementById('preview');

  const allowedExt = ['.xls', '.xlsx'];
  const allowedMime = [
    'application/vnd.ms-excel',
    'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
  ];

  let selectedFile = null; // fichier mémorisé

  function showError(msg) {
    info.innerHTML = '<div class="error" style="color:red;">' + msg + '</div>';
    preview.innerHTML = '';
  }

  function clearInfo() {
    info.innerHTML = '';
    preview.innerHTML = '';
  }

  function normalizeDate(dateValue) {
    if (!dateValue) return '';
    if (typeof dateValue === 'string' && /^\d{4}-\d{2}-\d{2}$/.test(dateValue)) {
      return dateValue;
    }
    if (typeof dateValue === 'string' && /^\d{1,2}\/\d{1,2}\/\d{2}$/.test(dateValue)) {
      let [month, day, year] = dateValue.split('/').map(v => parseInt(v, 10));
      if (year < 100) year = 2000 + year;
      return `${year}-${String(month).padStart(2, '0')}-${String(day).padStart(2, '0')}`;
    }
    return dateValue;
  }

  // 🟢 Étape 1 : mémoriser le fichier choisi
  input.addEventListener('change', (e) => {
    selectedFile = e.target.files[0];
    if (selectedFile) {
      info.innerHTML = `<div>Fichier sélectionné : <strong>${selectedFile.name}</strong></div>`;
    } else {
      info.innerHTML = '<div style="color:red;">Aucun fichier sélectionné.</div>';
    }
  });

  // 🟢 Étape 2 : lancer le traitement seulement quand on clique sur "Importer"
  btn.addEventListener('click', async () => {
    const mois_annee = document.getElementById('mois_annee').value;
    if (!mois_annee) {
        showError("Veuillez sélectionner le mois et l'année avant d'importer.");
        return;
    }

    if (!selectedFile) {
      showError('Veuillez d\'abord sélectionner un fichier Excel.');
      return;
    }

    clearInfo();

    const name = selectedFile.name || '';
    const lower = name.toLowerCase();
    const ext = lower.slice(lower.lastIndexOf('.'));
    const mime = selectedFile.type || '';

    // Validation du type
    if (!allowedExt.includes(ext) && !allowedMime.includes(mime)) {
      showError('Type de fichier non autorisé. Sélectionnez un fichier .xls ou .xlsx.');
      return;
    }

    try {   
            console.log("Mois/Année sélectionné :", mois_annee);
            const tab = mois_annee.split('-')
            console.log("Mois",tab[0],"/Année sélectionné :", tab[1]);

            const data = await selectedFile.arrayBuffer();
            const workbook = XLSX.read(data, { type: 'array' });
            const firstSheetName = workbook.SheetNames[0];
            const worksheet = workbook.Sheets[firstSheetName];

            const rows = XLSX.utils.sheet_to_json(worksheet, {
                header: 1,
                raw: false,
                dateNF: 'yyyy-mm-dd'
            });

            let annee = tab[0];
            let mois = tab[1];
            
            let liste_products = [];

            rows.forEach((row, rowIndex) => {
                if (rowIndex !== 0)
                {
                    liste_products.push(
                        {
                            code: row[0],
                            name: row[1],
                            quantite: row[2]
                        }
                    );
                }
            });
            console.log("data", liste_products);
            // Envoi au backend Django
            $.ajax({
                url: '/Import_Prevision_file/',
                type: 'POST',
                data: {
                annee: annee,
                mois: mois,
                articles: JSON.stringify(liste_products),
                csrfmiddlewaretoken: '{{ csrf_token }}'
                },
                success: function (response) {
                window.location.href = '/home/';
                },
                error: function (xhr, status, error) {
                console.error("Erreur: " + error);
                showError("Erreur lors de l'importation : " + error);
                }
            }); 

    } catch (err) {
      console.error(err);
      showError('Impossible de lire le fichier côté client. ' + err);
    }
  });
</script>

{% endblock %}